<template>
	<view>
		<view class="msg" v-for="(item,index) in loveList" :key="item.id">
			<view style="display: flex;justify-content: space-between;align-items: center;" @click="turn(item.id)">
				<view
					style="display: flex;align-items: center;justify-content:flex-start;margin-top: 22rpx;margin-left: 22rpx;">
					<u-avatar :src="item.userPic" shape="circle" size="35" :lazy-load="true"></u-avatar>
					<view style="margin-left: 5px;">
						<view style="font-weight: 500;">{{item.userName}}</view>
						<view class="timestamp">{{item.createTime}}</view>
					</view>
				</view>
				<view style="display: flex;">
					<view style="width: 100rpx;margin-right: 18rpx;" v-if="item.top==='1'&& ind===0">
						<u-tag text="置顶" type="warning" shape="circle"></u-tag>
					</view>
					<!-- 					<view style="width: 100rpx;margin-right: 18rpx;" v-if="item.isguan!==1">
						<u-tag text="关注" shape="circle"></u-tag>
					</view>
					<view style="width: 128rpx;margin-right: 18rpx;" v-if="item.isguan===1||item.isguan==='1'">
						<u-tag text="已关注" shape="circle" plain plainFill></u-tag>
					</view> -->
				</view>
			</view>
			<u-toast ref="uToast"></u-toast>
			<view class="zhu">
				{{item.content}}
				<!--  <video id="myVideo" src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4"
                                    @error="videoErrorCallback" :danmu-list="danmuList" enable-danmu danmu-btn controls></video> -->
				<view class="albums" v-if="item.picUrls!==null"
					:style="item.picUrls.length!==1&&item.picUrls.length!==2&&item.picUrls.length%3>=0?'justify-content:center':'justify-content:flex-start'">
					<u-album :urls="item.picUrls" multipleSize="100" maxCount="9" keyName="picUrl"
						v-if="item.picUrls.length!==0"></u-album>
				</view>
				
				
				<!-- 失物招领 -->
				<view style="margin-top: 15rpx;" v-if="item.type===3&&item.zhaolingType===0">
					<u--text prefixIcon="file-text-fill" iconStyle="font-size: 20px" :text="'拾物地点:'+item.address" lineHeight="20"></u--text>
					<u--text prefixIcon="clock-fill" iconStyle="font-size: 17px" :text="'拾物时间:'+ item.findTime" lineHeight="25"></u--text>
					<u--text prefixIcon="phone-fill" iconStyle="font-size: 20px" :text="'联系电话:'+ item.tel" lineHeight="20"> </u--text>
				</view>
				
				<!-- 寻物启示 -->
				<view style="margin-top: 15rpx;" v-if="item.type===3&&item.zhaolingType===1">
					<u--text prefixIcon="file-text-fill" iconStyle="font-size: 20px" :text="'拾物地点:'+item.address" lineHeight="20"></u--text>
					<u--text prefixIcon="clock-fill" iconStyle="font-size: 17px" :text="'拾物时间:'+ item.findTime"  lineHeight="25"></u--text>
					<u--text prefixIcon="phone-fill" iconStyle="font-size: 20px" :text="'联系电话:'+ item.tel" lineHeight="20"> </u--text>
				</view>
				
			
				<view style="margin-top: 38rpx;padding-bottom: 50rpx;">
					<u-row justify="space-between">
						<u-col span="7" @click="turn(item.id)">
							<view style="width: 155rpx;">
								<u-tag :text="item.typeName" plain type="warning" shape="circle"></u-tag>
							</view>
						</u-col>
						<u-col span="5">
							<view class=" dian">
								<u--text prefixIcon="eye" iconStyle="font-size: 20px" :text="item.viewCount"></u--text>
								<u--text prefixIcon="thumb-up" iconStyle="font-size: 20px;color:red"
									@click="dian(item.id,index,1)" v-if="item.isdian===1"
									:text="item.zanId===null?0:item.zanId"></u--text>
								<u--text prefixIcon="thumb-up" iconStyle="font-size: 20px;" v-if="item.isdian===0||item.isdian===null"
									@click="dian(item.id,index,0)" :text="item.zanId===null?0:item.zanId"></u--text>
								<u--text prefixIcon="chat" iconStyle="font-size: 20px"
									:text="item.pingId===null?0:item.pingId" v-if="pianUser.status!==2&&pianUser.status!=='2'"></u--text>
							</view>
						</u-col>

					</u-row>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "list",
		props: ['loveList', 'ind'],
		data() {
			return {
				pianUser:uni.getStorageSync("user"),
				// loveList: [],
				// params: {
				// 	loginId: 0
				// },
				user: ''
			};
		},
		methods: {
			async dian(id, index, type) {
                var login =this.$isLogin()
				if(!login){
					return;
				}

				const res = await this.$myRuquest({
					url: '/font/zan/' + id,
					data: uni.getStorageSync("loginUser")
				})
				if (type === 1) {
					this.loveList[index].isdian = 0
					if (this.loveList[index].zanId >= 1) {
						this.loveList[index].zanId = this.loveList[index].zanId - 1
					}
				} else {
					this.loveList[index].isdian = 1
					this.loveList[index].zanId = this.loveList[index].zanId + 1
				}


			},
			turn(id) {
				uni.navigateTo({
					url: '/pagesa/loveDetail/loveDetail?id=' + id
				})
			},
			getUser() {
				var user = uni.getStorageSync("user")
				var that = this
				if (user === '' || user === null || user === undefined) {
					uni.login({
						provider: 'weixin',
						success(res) {
							const a = {
								code: res.code
							}
							console.log(res.code)
							uni.request({
								url: that.$baseurl + "/font/login",
								method: "post",
								data: a,
								success: (res2) => {
									uni.setStorageSync("user", res2.data.data)
								}
							})
						}
					})
				}
			},

		},
		mounted() {
			// this.getUser()

		},
		onLoad() {
			// this.getList()
		},

	}
</script>

<style lang="scss">
	.timestamp {
		margin-right: 9rpx;
		color: #999;
		font-size: 12px;
	}

	.msg {
		margin-bottom: 25rpx;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
		background-color: #ffffff;
		border-radius: 25rpx;
		margin-left: 21rpx;
		margin-right: 21rpx;
		margin-top: 15rpx;

		.zhu {
			margin-top: 19rpx;
			color: #282828;
			font-size: 16px;
			margin-left: 31rpx;
			margin-right: 31rpx;

			.albums {
				margin-top: 15rpx;
				display: flex;
				align-items: center;
			}

			.dian {
				color: #848484;
				margin-right: -20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

		}
	}
</style>